/* ==========================================================================
   Global
   ========================================================================== */
html { font-size: 62.5%; }
a { color: #333; }
a:hover { color: #d4111f; }
body {color: #333; font: 12px/1.7 Arial, Helvetica, sans-serif; background: #fff; }
.wrapper{max-width:1200px; margin:0 auto;}
a:focus{outline:none;}
/* ==========================================================================
   Header
   ========================================================================== */
header {width: 100%; }
.head{ width:1200px;margin:0 auto;height:100px; position: relative; z-index: 99; overflow: hidden; }
.logo {float: left;margin-top: 10px; }
.head .headrig{float: right; text-align: right;max-width: 500px;}
.weblink{font:14px/18px microsoft yahei;margin-top: 28px;}
.weblink a{margin:0 5px;}
.toptel{font:14px/18px microsoft yahei;height: 40px;margin-top: 10px; }
.toptel .fa{color: #dd0111;margin-left: 30px;}

/* ==========================================================================
   Nav
   ========================================================================== */
.navbar {width:100%;
  background:#8f9091;
  background-image: -webkit-linear-gradient(top,#8f9091 0%,#a6a6a7 100%);
  background-image: -moz-linear-gradient(top,#8f9091 0%,#a6a6a7 100%);
  background-image: linear-gradient(top,#8f9091 0%,#a6a6a7 100%);
  filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, EndColorStr='#8f9091', StartColorStr='#a6a6a7');
}
/* primary */
.navbcon{width:1200px; margin: 0 auto;position: relative; z-index: 99;}
.globalnav { }
.globalnav li { float: left;height:40px;text-align: center; background: url(../images/inco_jg.jpg) left 14px no-repeat; }
.globalnav li a { display: block; color: #fff; font:14px/40px microsoft yahei;padding:0 45px; }
.globalnav li:hover{border-bottom: 2px solid #d51121;height: 38px;}
.globalnav li.active {border-bottom: 2px solid #d51121;height: 38px;}
.globalnav .dropdown { position: absolute; top:40px;z-index: 99; background: #fff; display: none; padding:15px 50px;border-bottom: 2px solid #d51121;}
.globalnav .dropdown a { white-space: nowrap; line-height: 40px; color: #333; padding-bottom: 0; border-bottom: 0 none; padding-left: 0; padding-right: 0; font-weight: 300; }
.globalnav .dropdown a:hover { color: #d51120;}
.globalnav .dropdown .dr_rig{float: left; text-align: left; border-right: 1px solid #9a9b9c;padding-right:50px;}
.globalnav .dropdown .pic{float: right;margin-left: 40px;}

#gn_00 { margin-left: 0; }
#gn_06 .dropdown{width:400px;right: 0;}
#gn_05 .dropdown{right: 0;}


/* ==================================
   banner
   ================================== */
.banner { position: relative; min-width: 1000px; width: 100%; height:575px; overflow: hidden;}
.banner .bd li a { position: absolute; left: 0; top: 0; overflow: hidden; background-position: 50% 50%; background-repeat: no-repeat; width: 100%; height: 575px; }
.banner .hd { position: absolute; width: 100%; left: 0; text-align: center; bottom: 10px; }
.banner .hd ul { display: inline-block; *display:inline;zoom: 1; }
.banner .hd li { float: left; cursor: pointer; width: 50px; height: 5px; margin: 0 4px; background: #fff;
  -webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
  -moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
  -ms-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
  -o-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
  box-shadow: 3px 3px 3px rgba(0,0,0,0.12)
}
.banner .hd .on { background: #d01010;}
.prev,.next { position: absolute; top: 50%; cursor: pointer; -webkit-transition: all 300ms; -moz-transition: all 300ms; transition: all 300ms; }
.tempWrap { margin: 0 auto; }
.banner .prev,
.banner .next { margin-top: -30px; }
.banner .prev .fa,
.banner .next .fa { font-size: 50px; color: #fff; line-height: 60px; text-shadow: 1px 1px 3px rgba(0,0,0,.2); }
.banner .prev { left: 2%; }
.banner .next { right: 2%; }
.banner .prev:hover .fa,
.banner .next:hover .fa { color: #e60012; }
/* ==========================================================================
   Content
   ========================================================================== */
.home_about{width: 100%;padding:40px 0;}
.hometit{font: 300 30px/30px microsoft yahei; text-align: center;padding-bottom: 30px;}
.home_about .mode01{width: 870px; height: 350px; overflow: hidden; float: left;}
.home_about .mode01 .imgarea{width: 380px; height: 350px; overflow: hidden; float: left;-webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;}
.home_about .mode01 .imgarea img{width: 380px;height: 350px;transition: transform 2s;}
.home_about .mode01 .imgarea:hover img{ transform: scale(1.1);} 
.home_about .mode01 .txtarea{width: 450px; height: 350px; overflow: hidden; float: right;font: 300 14px/26px microsoft yahei;}
.home_about .mode01 .txtarea .desc{height: 208px; overflow: hidden;margin:20px 0 ;}
.home_about .mode01 .txtarea h2{font: 300 18px/24px microsoft yahei;margin-top: 20px;}
.home_about .mode01 .txtarea a.more{border:1px solid #d5d3d3;display: block;font: 300 14px/40px microsoft yahei;width: 200px;text-align: center;}

.focusBox { position: relative; width: 280px; height: 340px; overflow: hidden;  background:#fff; float: right;padding:5px;
  border:1px solid #d9d9d9; -webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
  -moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
  -ms-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
  -o-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
  box-shadow: 3px 3px 3px rgba(0,0,0,0.12)

 }
 .focusBox .pic {width: 280px; height: 340px; line-height: 340px;text-align: center;}
.focusBox .pic img {height: 340px;width:280px; } 
.focusBox .num { position: absolute; z-index: 999; bottom: 8px; width: 100%; height:15px;text-align: center;} 
.focusBox .num li{ width: 10px; height: 10px; display: inline-block;overflow: hidden; text-align: center; margin-right: 1px; cursor: pointer; background: #e0dfdf;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
} 
.focusBox .num li.on{background: #d51120;}

.home_product{width: 100%;padding:70px 0; background: #f2f3f6;}
.dh ul{position: relative;overflow: hidden;width: 1200px;height: 300px;margin: 0 auto;}
.dh ul li{float: left;width: 158px;overflow: hidden;height: 100%;position: relative;cursor: pointer;border-right: 1px solid #fff;}
.dh ul li a{display: block;width: 100%;height: 100%;}
.dh ul li .layer{position: absolute;bottom: 0;left: 0;width: 100%;background:rgba(0,0,0,0.7);height: 100%;}
.dh ul li .layer .p1{position: absolute;bottom: 119px;left: 50px;}
.dh ul li .layer .p2{position: absolute;bottom: 50px;right: -250%; border:3px solid #c8c8c8;width:320px; height: 150px;padding-top: 50px; overflow: hidden;display: block; text-align: center;}
.dh ul li .layer .p2 b,.dh ul li .layer .p2 span{display: block;font-weight: bold;font-size: 20px;}
.dh ul li .layer .p1 b,.dh ul li .layer .p1 span{display: block;font-weight: bold;font-size: 14px;}
.dh ul li.curr{}
.dh ul li .layer .p2 a.col1{color: #fff; background: #d51120;display: block;width: 150px; height: 34px;margin:30px auto 0 auto; text-decoration: none;
  font: 300 14px/34px microsoft yahei;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}
.col2{color: #fff; font: 300 20px/34px microsoft yahei;}

.home_contact{width: 100%;padding:40px 0; background: #566987;color: #fff;}
.home_contact .mode01{width: 310px; height: 185px; overflow: hidden; float: left;}
.home_contact .mode01 .img{width: 310px;height: 185px;}
.home_contact .mode02{width: 450px; height: 185px; overflow: hidden; float: left;margin-left: 60px;font: 300 14px/30px microsoft yahei;}
.home_contact .mode02 h2{font: 300 24px/24px microsoft yahei;text-transform:Uppercase;margin-bottom: 20px;}
.home_contact .mode02 .tel{float: left; width: 50%;}
.home_contact .mode02 .addr{float: left;width: 50%;}
.home_contact .mode03{width: 310px; height: 185px; overflow: hidden; float: right;}
.home_contact .mode03 .img{width: 310px;height: 185px;}

/* ==========================================================================
   Footer
   ========================================================================== */
footer { color: #424141; font-size: 12px; background: #fff; font-family: microsoft yahei; padding-top:20px;}
footer a { color: #424141; }
footer a:hover { text-decoration: underline; }
.footer-nav { text-align: justify; }
.footer-nav:after { content: ""; width: 100%; display: inline-block; font-size: 0; line-height: 0; }
.fn-col { display: inline-block; *display:inline;zoom: 1; vertical-align: top; *padding-right: 100px; }
.fn-col h3 {  margin-bottom: 10px; font: 300 15px/24px microsoft yahei;}
.fn-col h3 a { color:#424141;}
.fn-col h3 a:hover { color: #d51120; }
.fn-col ul {}
.fn-col li { line-height: 24px; }
.fn-col li a { color: #424141;  }
.fn-col li a:hover { color: #d51120; }
.fn_ewm{width:320px;}
.fn_ewm .mode01{height: 155px;margin-bottom: 10px;}
.fn_ewm .mode01 .img{float: left;margin-right: 20px;}
.fn_ewm .mode01 .img{width: 155px;height: 155px;}
.fn_ewm .mode01 .txt{float: left; font-size: 16px;padding-top: 45px;}
.fn_ewm .mode02 a:hover img{filter: alpha(opacity=80);opacity: 0.8;}
.footbd{color: #fff;font: 300 13px/24px microsoft yahei; padding:20px 0; text-align: center;border-top: 1px solid #7e7c7d; background: #1d1d1d;}
.footbd a{ color: #fff;}

.mohead{display: none;}
.mohead{position:relative; height:50px;}
.mohead .logo{display:block;width: calc(100% - 160px);margin-top: 0; height:50px;line-height:50px;position:absolute;top:0;left:10px;z-index:9;}
.mohead .logo img{height: 40px;}
.banner .bd li a.moimg{display: none;}
@media only screen and (max-width:420px) {
.dh ul{width: 100%;height:auto;}
.dh ul li{width: 100% !important;}
.dh ul li img{width: 100%;}
.dh ul li .layer{width: 100%;margin:0 auto;height:100% !important;}
.dh ul li .layer .p2 { position: absolute; bottom: 50px; right: 10%; width: 80%;}
.dh ul li .layer .p1 {display: none;}
.home_about .mode01 { width: 100%; height: auto; overflow: hidden; float: none;}
.banner{min-width:320px;}
.pchead,.navbar{display: none;}
.mohead{display: block;}
.home_about .mode01 .txtarea{width: 100%;float: left;}
.focusBox{float: none;margin:0 auto;}
.home_about .mode01 .imgarea { width: 100%; height: auto; overflow: hidden; float: none;}
.home_about .mode01 .imgarea img{width: 100%; height: auto;}
.home_about{padding:20px 10px;width: calc(100% - 20px);}
.home_contact .mode01 { width: 100%; height: 185px; overflow: hidden; float: none;margin-bottom: 20px;}
.home_contact .mode01 img{max-width: 100%;}
.home_contact .mode02 ,.home_contact .mode03{width: 100%;    height: auto;    float: none;    margin-left: 0;}
.home_contact .mode03 img{max-width: 100%;margin-top: 20px;}
.home_contact{padding:20px 10px;width: calc(100% - 20px);}
.fn-col ul,.fn_ewm .mode01{display: none;}
footer{margin:0 20px;}
.footbd{padding:20px;}
.footbd .fl,.footbd .fr{float: none;}
.banner .bd li a.moimg{display: block;}
.banner .bd li a.pcimg{display: none;}
.banner .bd li a{height: 200px;background-size: cover;}
.banner{height: 200px;}
}





